<!-- 状态--下拉框---在计划中没用 -->
<template>
  <px-form-item label="状态" prop="planStatus" :rules="{ required: props.isRequired, message: '请选择状态', trigger: 'change' }">
    <px-select v-model="planStatusVal" clearable filterable placeholder="请选择状态" style="width: 100%" @change="changePlanStatus">
      <px-option v-for="item in planStatusList" :key="item.id" :label="item.name" :value="item.value" />
    </px-select>
  </px-form-item>
</template>

<script setup lang="ts">
import { onMounted, watch, ref } from "vue";
import { queryDictData } from "@/api/common";

// 父级方法和值
const emits = defineEmits(["changePlanStatus"]);
const props = defineProps(["planStatus", "isRequired"]);

const planStatusVal = ref("");
const planStatusList = ref([]);

watch(
  () => props.planStatus,
  val => {
    planStatusVal.value = props.planStatus;
  },
  { immediate: true }
);
onMounted(() => {
  queryPlanStatusSelect();
});
// 获取状态下拉列表
const queryPlanStatusSelect = async () => {
  const tempPlanStatusList = await queryDictData({ typeCode: "ERC_CHECK_PLAN_STATUS" });
  planStatusList.value = tempPlanStatusList || [];
};
// 改变状态值，传值给父级并做改变
const changePlanStatus = () => {
  emits("changePlanStatus", planStatusVal.value);
};
</script>
